
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TA交易数据</title>
    <link type="text/css" rel="stylesheet" href="layui/css/layui.css" media="all">
    <script type="text/javascript" src="layui/layui.js"></script>
</head>

<body>

<script type="text/html" id="userToolBar2">
    <div style="margin-top: 0px;margin-left: 0px" >
        <form class="layui-form layui-col-space5">
            <div class="layui-inline layui-show-xs-block">
                <label class="layui-form-label layui-bg-gray" style="width: 110px;text-align: center">成交日期</label>
                <div class="layui-inline layui-show-xs-block">
                    <input class="layui-input"  autocomplete="off" placeholder="请输入成交日期" name="businessEndTime" id="businessEndTime1">
                </div>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <label class="layui-form-label layui-bg-gray" style="width: 110px;text-align: center">交易类型</label>
                <div class="layui-inline layui-show-xs-block">
                    <select name="businessType" id="businessType">
                        <option placeholder="请选择" value="0"></option>
                        <option value="1">申购</option>
                        <option value="2">赎回</option>
                        <option value="3">认购</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <button class="layui-btn layui-btn-primary"  lay-submit="" lay-filter="select" lay-event="select"><i class="layui-icon">&#xe615;</i>搜索</button>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <button class="layui-btn "  type="button" lay-submit="trade" lay-filter="search1" lay-event="search1" name="trade" onclick="return false;" >结算</button>
            </div>
        </form>
        <ul class="layui-tab-title" style="border-bottom-color: #D0D0D0">
            <li class="layui-this" lay-id="no" style="color:#FF00FF">未结算</li>
            <li class="layui-this" lay-id="yes">已结算</li>
        </ul>
    </div>
</script>

<script type="text/html" id="userToolBar">
    <div style="margin-top: 0px;margin-left: 0px" >
        <form class="layui-form layui-col-space5">
            <div class="layui-inline layui-show-xs-block">
                <label class="layui-form-label layui-bg-gray" style="width: 110px;text-align: center">成交日期</label>
                <div class="layui-inline layui-show-xs-block">
                    <input class="layui-input"  autocomplete="off" placeholder="请输入成交日期" name="businessEndTime" id="businessEndTime2">
                </div>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <label class="layui-form-label layui-bg-gray" style="width: 110px;text-align: center">交易类型</label>
                <div class="layui-inline layui-show-xs-block">
                    <select name="businessType" id="businessType2">
                        <option placeholder="请选择" value="0"></option>
                        <option value="1">申购</option>
                        <option value="2">赎回</option>
                        <option value="3">认购</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <button class="layui-btn layui-btn-primary"  lay-submit="" lay-filter="select2" lay-event="select2"><i class="layui-icon">&#xe615;</i>搜索</button>
            </div>
            <div class="layui-inline layui-show-xs-block">
                <button class="layui-btn"  type="button" lay-submit="trade" lay-filter="search2" lay-event="search2" name="trade" onclick="return false"; >反结算</button>
            </div>
        </form>
        <ul class="layui-tab-title" style="border-bottom-color: #D0D0D0">
            <li class="layui-this" lay-id="no" >未结算</li>
            <li lay-id="yes"style="color:#FF00FF">已结算</li>
        </ul>
    </div>
</script>
<!--
<div  style="width: 222px;height: 222px; background-color: #0C0C0C"></div>
-->
<div class="layui-tab" lay-filter="test">
    <div class="layui-tab-content">
        <div class="layui-tab-item layui-show">
            <table id="userTable2" lay-filter="userTable2"></table>
        </div>
        <div class="layui-tab-item">
            <table id="userTable" lay-filter="userTable"></table>
        </div>
    </div>
</div>


<script type="text/javascript">
        layui.use(['element', 'form', 'table', 'layer', 'laydate'], function () {
            var layer = layui.layer;
            var $ = layui.$;
            var table = layui.table;
            var form = layui.form;
            var laydate = layui.laydate;

            laydate.render({
                elem: '#tradeDate1' //结算日期
            });

            laydate.render({
                elem: '#tradeDate2' //反结算日期
            });
        //未结算表格数据
        table.render({
            elem: '#userTable2',
            url: '/selectTaSettlement?businessState=2',
            page: true,
            height:'full-20',
            minLength:80,
            toolbar:'#userToolBar2',
            limits:[1,2,3,4,5,6,7,8,9,10],
            cols:[[
                {type:'checkbox',fixed:'left'}
                , {field: 'fundId', title: '基金编号',align: 'center'}
                , {field: 'taId', title: 'TA交易编号',align: 'center'}
                , {field: 'cashId', title: '现金ID',align: 'center'}
                , {field: 'businessNum', title: '数量',align: 'center'}
                , {field: 'businessTime', title: '交易日期',align: 'center'}
                , {field: 'businessPrice', title: '单价',align: 'center'}
                , {field: 'totalMoney', title: '总金额',align: 'center'}
                , {field: 'businessType', title: '类型',  align: 'center', templet: function (item) {
                    if (item.businessType == '1') {
                    return '认购';
                } else if (item.businessType == '2') {
                    return '申购';
                } else if (item.businessType == '3') {
                    return '赎回';
                }
            }
        }
    , {
            fixed: 'right',field: 'businessState', title: '状态', align: 'center', templet: function (item) {
                if (item.businessState == '1') {
                    return "<span style='color: green'>已结算</span>";
                } else if (item.businessState == '2') {
                    return "<span style='color: red'>未结算</span>";
                }
            }
        }
    ]]
        });


        //已结算表格数据
       table.render({
            elem: '#userTable',
            url: '/selectTaSettlement?businessState=1',
            page: true,
            height:'full-20',
            minLength:80,
            toolbar:'#userToolBar',
            limits:[1,2,3,4,5,6,7,8,9,10],
            cols: [[
                {type:'checkbox',fixed:'left'}
                , {field: 'fundId', title: '基金编号',align: 'center'}
                , {field: 'taId', title: 'A交易编号',align: 'center'}
                , {field: 'cashId', title: '现金ID',align: 'center'}
                , {field: 'businessNum', title: '数量',align: 'center'}
                , {field: 'businessTime', title: '交易日期',align: 'center'}
                , {field: 'businessPrice', title: '单价',align: 'center'}
                , {field: 'totalMoney', title: '总金额',align: 'center'}
                , {field: 'businessType', title: '类型',  align: 'center', templet: function (item) {
                        if (item.businessType == '1') {
                            return '认购';
                        } else if (item.businessType == '2') {
                            return '申购';
                        } else if (item.businessType == '3') {
                            return '赎回';
                        }
                    }
                }
                , {
                    fixed: 'right',field: 'businessState', title: '状态', align: 'center', templet: function (item) {
                        if (item.businessState == '1') {
                            return "<span style='color: green'>已结算</span>";
                        } else if (item.businessState == '2') {
                            return "<span style='color: red'>未结算</span>";
                        }
                    }
                }
            ]]
        });




        //给工具条的结算添加事件
        table.on('toolbar(userTable2)', function (obj) {

            switch (obj.event) {
                case "search1":
                    //获得选中的对象
                    var checkStatus = table.checkStatus("userTable2"); //idTest 即为基础参数 id 对应的值
                    // 其中 ID 为基础参数 id 对应的值（见：设定容器唯一ID）
                    var dataArr = checkStatus.data; //获取选中行的数据
                    //转json格式
                    var taSettlement=JSON.stringify(dataArr);
                    if (dataArr.length == 0) {
                        layer.msg("请先选中数据");
                    }
                    else {
                        layer.confirm('真的要结算吗？', function () {
                            //向服务端发送结算指令
                            $.post("updateTaSettlement"
                                ,"taSettlement="+taSettlement
                                ,function(msg){
                                if(msg>0){
                                    table.reload('userTable2');
                                    table.reload('userTable');  /!*渲染刷新*!/
                                    layer.closeAll();
                                    layer.msg('结算成功',{
                                        title : '提示',
                                        area : [ '200px',
                                            '140px' ],
                                        btn : [ '知道了' ]
                                    });
                                }
                                else{
                                    layer.closeAll();
                                    layer.msg('结算失败',{
                                        title : '提示',
                                        area : [ '200px',
                                            '140px' ],
                                        btn : [ '知道了' ]
                                    });
                                }
                            });
                            return false;
                        });
                    }
                    break;
                case 'select':
                    var tradeDate= $("#tradeDate1").val();//空
                    var tradeType= $("#tradeType").val();//空
                    //表格的重新加载事件
                    table.reload('userTable2', {
                        method: 'post'
                        , where: {
                            'tradeDate': tradeDate,
                            'tradeType': tradeType
                        }
                        , page: {
                            curr: 1
                        }

                    })
                    laydate.render({
                        elem: '#tradeDate1' //结算日期
                    });
                    $("#tradeDate").val(tradeDate);
                    $("#tradeType").val(tradeType);
                    break;
            }
        });
        //给工具条的反结算添加事件
        table.on('toolbar(userTable)', function (obj) {

            switch (obj.event) {
                case "search2":
                    //获得选中的对象
                    var checkStatus = table.checkStatus("userTable"); //idTest 即为基础参数 id 对应的值
                    // 其中 ID 为基础参数 id 对应的值（见：设定容器唯一ID）
                    var dataArr = checkStatus.data; //获取选中行的数据
                    //转json格式
                    var taSettlement=JSON.stringify(dataArr);
                    if (dataArr.length == 0) {
                        layer.msg("请先选中数据");
                    }
                    else {
                        layer.confirm('真的要反结算嘛', function () {
                            layer.close();
                            //向服务端发送删除指令
                            $.post("updateTaSettlementTwo","taSettlement="+taSettlement,function(msg){
                                if(msg>0){
                                    table.reload('userTable');
                                    table.reload('userTable2');  /*渲染刷新*/
                                    layer.closeAll(); //关闭所有层
                                    layer.msg('反结算成功,共反结算'+msg+"条",{
                                        title : '提示',
                                        area : [ '200px',
                                            '140px' ],
                                        time : 0,
                                        btn : [ '知道了' ]
                                    });
                                }
                                else{
                                    layer.closeAll();
                                    layer.msg('反结算失败',{
                                        title : '提示',
                                        area : [ '200px',
                                            '140px' ],
                                        time : 0,
                                        btn : [ '知道了' ]
                                    });
                                }
                            });
                            return false;
                        });
                    }
                    break;
                case 'select2':
                    var tradeDate= $("#tradeDate2").val();
                    var tradeType= $("#tradeType2").val();
                    //表格的重新加载事件
                    table.reload('userTable', {
                        method: 'post'
                        , where: {
                            'tradeDate': tradeDate,
                            'tradeType': tradeType,
                        }
                        , page: {
                            curr: 1
                        }
                    });
                    laydate.render({
                        elem: '#tradeDate2' //反结算日期
                    });
                    $("#tradeDate").val(tradeDate);
                    $("#tradeType").val(tradeType);
                    break;
            }
        });
    });
</script>


</body>
</html>

